<template>
  <div>
    <div class='hx_list_row'>
      <div class='hx_list_col'><i>机</i><i>构</i></div>
      <div class='hx_list_col'>:</div>
      <div class='hx_list_col'>{{info.companyname}}</div>
    </div>
    <div class='hx_list_row'>
      <div class='hx_list_col'><i>卡</i><i>号</i></div>
      <div class='hx_list_col'>:</div>
      <div class='hx_list_col'>{{info.cardId}}</div>
    </div>
    <div class='hx_list_row'>
      <div class='hx_list_col'><i>编</i><i>号</i></div>
      <div class='hx_list_col'>:</div>
      <div class='hx_list_col'>{{info.empnoId}}</div>
    </div>

    <div class='hx_list_row'>
      <div class='hx_list_col'><i>姓</i><i>名</i></div>
      <div class='hx_list_col'>:</div>
      <div class='hx_list_col'>{{info.name}}</div>
    </div>

    <div class='hx_list_row'>
      <div class='hx_list_col'><i>年</i><i>级</i><i>/</i><i>部</i><i>门</i></div>
      <div class='hx_list_col'>:</div>
      <div class='hx_list_col'>{{info.Department}}</div>
    </div>

    <div class='hx_list_row'>
      <div class='hx_list_col'><i>班</i><i>级</i><i>/</i><i>职</i><i>务</i></div>
      <div class='hx_list_col'>:</div>
      <div class='hx_list_col'>{{info.post}}</div>
    </div>
  </div>
</template>

<script>
export default {
  name: "hx-list",
  props: {
    info: {
      type: Object,
      default: {}
    },
  },
}
</script>

<style scoped lang="scss">
.hx_list {
  &_row {
    padding-left: 20PX;
    display: flex;
    flex-direction: row;
    line-height: 2;
    font-size: 14PX;
    font-weight: 700;
  }

  &_col {
    display: flex;
  }

  &_col:nth-child(1) {
    width: 70PX;
    justify-content: space-between;
  }

  &_col:nth-child(2) {
    width: 15PX;
    margin-right: 15PX;
    justify-content: center;
  }
}
</style>
